<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    {% load static %}
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>天天生鲜-登录</title>
	<link rel="stylesheet" type="text/css" href="{% static 'css/reset.css' %}">
	<link rel="stylesheet" type="text/css" href="{% static 'css/main.css' %}">




</head>
<body>
	<div class="login_top clearfix">
		<a href="index.html" class="login_logo"><img src="{% static 'images/logo02.png' %}"></a>
	</div>

	<div class="login_form_bg">
		<div class="login_form_wrap clearfix">
			<div class="login_banner fl"></div>
			<div class="slogan fl">日夜兼程 · 急速送达</div>
			<div class="login_form fr">
				<div class="login_title clearfix">
					<h1>用户登录</h1>
					<a href="{% url 'goods:register' %}">立即注册</a>
				</div>
				<div class="form_input">
					<form method="post">
                        {% csrf_token %}
						<input type="text" name="username" class="name_input" value="{{ username }}" placeholder="请输入用户名" >
						<div class="user_error">输入错误</div>
						<input type="password" name="pwd" class="pass_input" placeholder="请输入密码">
						<div class="pwd_error">输入错误</div>

                        <div class="tuwen" style="position: absolute;top: 120px;">

                                验证码:{{ register_form.captcha  }}
                            <span style="color: red" id="msg" ></span>

						</div>

						<div class="more_input clearfix" style="margin-top: 54px">
							<input type="checkbox" name="remember" {{ checked }}>
							<label>记住用户名</label>
							<a href="#">忘记密码</a>
						</div>
						<input type="button" name="" value="登录" class="input_submit" style="margin-top: 30px" id="denglu">

					</form>
				</div>
			</div>
		</div>
	</div>
    <span style="color: red">{{ error_msg }}</span>
	<div class="footer no-mp">
		<div class="foot_link">
			<a href="#">关于我们</a>
			<span>|</span>
			<a href="#">联系我们</a>
			<span>|</span>
			<a href="#">招聘人才</a>
			<span>|</span>
			<a href="#">友情链接</a>		
		</div>
		<p>CopyRight © 2016 北京天天生鲜信息技术有限公司 All Rights Reserved</p>
		<p>电话：010-****888    京ICP备*******8号</p>
	</div>
    <style type="text/css">
        #id_captcha_1{
            width: 100px;
            background-color: whitesmoke;
            height: 45px;
        }
    </style>
    <script type="text/javascript" src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>

    <script type="text/javascript">
       $(function () {
           //alert("123132")
           var code=true;
           var username=false
           var pwd=false

           $('.captcha').click(function () {
                $.getJSON("/puter/",function (result) {
                    //alert('OK');
                    $('.captcha').attr('src',result['image_url']);

                    $('#id_captcha_0').val(result['hashkey']);
                });
                return false;
           });
           //  验证
           $('#id_captcha_1').blur(function () {
               console.log('用户输入的:'+$('#id_captcha_1').val());
               // 获取输入框和隐藏字段id_captcha_0的数值
               code= $('#id_captcha_1').val();
               hashkey=$('#id_captcha_0').val();
               console.log(code);
               console.log(hashkey);
               $.getJSON('img_check',
               {'code':code,'hashkey':hashkey},function (res) {
                       // 1 验证码正确 0验证码错误
                       //alert('验证结果中...'+res);
                       console.log(res);
                       if (res.status==1){
                           code=false
                           alert(code)
                           $("#msg").html("验证码正确")
                       }else {
                           code=true
                           $('#msg').html("验证码错误")
                       }
                   })
           })
            $('#denglu').click(function () {
                if (code==false){
                        alert('数据正确')
                    $('#denglu').attr('type','submit')
           }else{
                    alert('数据不完整')

                }
            })

       })
    </script>

</body>
</html>